/**
 * Created by kroyo on 2017/8/4.
 */
@charset "utf-8";

$bcolor:#999999;
$bcolor-active:#1e87f2;
$labelcolor:#666666;

//公共样式

.span{
  color:$bcolor;
  border:1px solid $bcolor;
  border-radius: 2px;
  cursor: pointer;
}
.span.active,.span:hover{
  border-color: $bcolor-active;
  color: $bcolor-active;
}

.span100{
  width:100px;
  height:40px;
}
.span160{
  width:160px;
}


//排序方式  按钮(最热/最新)
.sortord{
  line-height:38px;
  margin-right: 30px;
  padding:0 18px;
  text-align: right;
}
.hot{
  background: url(../img/dlibrary/hot.png) no-repeat 28% 50%;
  &:hover,&.active{
    background-image: url(../img/dlibrary/hot-active.png);
  }
}
.newest{
  background: url(../img/dlibrary/newest.png) no-repeat 28% 50%;
  &:hover,&.active{
    background-image: url(../img/dlibrary/newest-active.png);
  }
}


.btn-more{
  width:100%;
  margin: 28px 0 40px;
  &>div{
    width:160px;
    height:50px;
    line-height: 48px;
    text-align: center;
    border-color: $bcolor-active;
    color: $bcolor-active;
    margin: 0 auto;
    cursor: pointer;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    &:hover,&.active{
      color: #fff;
      background-color: $bcolor-active;
    }
  }
}



//下拉选择列表
.select-dropdown{
  display: none;
  position: absolute;
  top:102px;
  left:260px;
  width:160px;
  height: 235px;
  background-color: #ffffff;
  -webkit-box-shadow: 0px 5px 5px rgba(0,0,0,.2);
  -moz-box-shadow: 0px 5px 5px rgba(0,0,0,.2);
  box-shadow: 0px 5px 5px rgba(0,0,0,.2);
  -webkit-transform: 0px -2px 0;
  -moz-transform: 0px -2px 0;
  -ms-transform: 0px -2px 0;
  -o-transform: 0px -2px 0;
  transform: 0px -2px 0;
  //-webkit-transition: all .4s;
  //-moz-transition: all .4s;
  //-ms-transition: all .4s;
  //-o-transition: all .4s;
  //transition: all .4s;
  z-index: 19;
  cursor: pointer;
  overflow: hidden;
  li{
    width:100%;
    height:40px;
    line-height: 38px;
    padding: 0 20px;
    span{
      font-size:14px;
      color: $bcolor;
    }
  }
  li:hover,li.active{
    background-color: #daecff;
    span{
      color: $bcolor-active;
    }
  }
}


//banner 轮播图样式
#banner{
  position: relative;
  width:100%;
  min-width: 1200px;
  overflow: hidden;
  li{
    text-align: center;
  }
  img{
    width:100%;
    min-width: 1200px;
    max-height: 600px;
    vertical-align: middle;
  }
  .fu-control{
    display: none;
  }
}

